<template>
	<div class="equipmentwarehousing">
		<back :title="title"></back>
		<!--<warehousingproduct v-show="isModalShow" @closeModal="closeModal" @newPorductList="newPorductList" :stockInProductInfos="stockInProductInfos"></warehousingproduct>-->
	    <ordernumber v-show="isShow" @close="close" @chooseOrder="chooseOrder"></ordernumber>
	   <header class="header">
	   	<div class="chooseOrder" @click="order">{{placehold}}{{purchaseOrderSerial}}</div>
	   <!--	<div class="lookInformation" @click="scanResult">扫描结果</div>-->
	   </header>	    
	    <!--<p class="result" v-for="item in productSerials">{{item}}</p>-->
	   <!-- <div class="scancode" @click="scan">扫描入库</div>-->
	   <!-- <div class="submit" @click="submit">确认</div>-->
	    <body class="body">
	    	<!--<div class="productlist" v-for="(item,index) in productList">
	    	 <p class="shopName">{{item.shopName}}</p>
	   	     <div class="product" v-for="(arr,sort) in item.purchaseProducts">
	   	   	   <p class="productName">{{arr.productName}}</p>
	   	   	   <div class="scan" @click="scanWarehousing(arr,index)">扫描入库</div>
	   	   </div>
	   </div>-->
	       <div class="productlist">
	       	 <!--<span>需要入库总数量：{{totalcount}}</span>
	       	 <span style="display: inline-block;text-align: right;">已入库数量：{{stockInCount}}</span>-->
	    	 <!--<p class="shopName">{{shopname}}</p>
	   	       <div class="product" v-for="(item,index) in productList">
	   	   	   <p class="productName">{{item.productName}}</p>
	   	   	   <div class="scan" @click="scansend(item,index)">扫描入库</div>
	   	    </div>-->
	   	      <div class="box">
	   	      	<p v-for="(item,index) in productList" :class="index == 0 ? 'active' :''">{{item}}</p>
	   	      </div>
	   	    <!--  <div class="scan" @click="scansend(item,index)">扫描入库</div>-->
	      </div>
	    </body>
	   <footer class="footer" v-if="productList.length != 0">
	    	<div class="submit" @click="scan">扫描入库</div>
	    </footer>
	</div>
</template>

<script>
import back from '@/components/m-shop/m-store/back'
import ordernumber from '@/components/m-shop/m-store/ordernumber'
import warehousingproduct from '@/components/m-shop/m-store/warehousingproduct'
import wx from 'weixin-js-sdk'

let result = ""
  
export default {
	name:'equipmentwarehousing',
	components: {
		back,
		ordernumber,
		warehousingproduct
	  },
	data () {
		return {
			title:'产品入库',
			isShow:false,
			stockInProductInfos:[],
			placehold:'请选择订单号',
			purchaseOrderSerial:'',
			isModalShow:false,
			productList:[],
			shopname:'',
			totalcount:0,
			stockInCount:0,
			resultStr:result,
		}
	},
	created () {
	},
	mounted () {
		/*setInterval(() => {
             this.scansend()
            }, 200);*/
		//this.getProductList ()		
	},
	methods:{
		//调微信扫描
		scan () {	
			     //result = ""
				//这里【url参数一定是去参的本网址】
				//获取微信认证参数的地址
				//console.log(3)
				let _this = this;
				let axios = this.$http.post;
				let reqUrl = this.$store.state.reqUrl;
				let shop_url = this.$route.query.shop_url;
				let purchaseOrderSerial = this.purchaseOrderSerial
				let shopId = this.$store.state.shop_id
				
				let url = location.href.split('#')[0];
				
				this.$http.get("http://www.ewj100.com/ewj/shop/wx/jsapi/createJsapiSignature?url="+url,{}).then(res => {
					wx.config({
						debug: false,
						// 必填，公众号的唯一标识               
						appId:res.data.appId,
						// 必填，生成签名的时间戳              
						timestamp: res.data.timestamp,
						// 必填，生成签名的随机串             
						nonceStr: res.data.nonceStr,
						// 必填，签名                
						signature: res.data.signature,
						// 必填，需要使用的JS接口列表，所有JS接口列表               
						jsApiList: ['checkJsApi', 'scanQRCode']
					});
			   })
				wx.error(function(res) {
					alert("出错了：" + res.errMsg);
					//这个地方的好处就是wx.config配置错误，会弹出窗口哪里错误，然后根据微信文档查询即可。
				});
				wx.ready(function() {
					wx.checkJsApi({
						jsApiList: ['scanQRCode'],
						success: function(res) {}
					});
					wx.scanQRCode({
						needResult: 1, // 默认为0，扫描结果由微信处理，1则直接返回扫描结果，                   
						scanType: ["qrCode"], // 可以指定扫二维码还是一维码，默认二者都有
						success: function(res) {
							   if(!!res.resultStr){
							   	 axios(reqUrl + shop_url, {
									purchaseOrderSerial: purchaseOrderSerial,
									productSerial:res.resultStr,
									shopId:shopId
								   }).then(res => {
									  _this.getProductList()
									  _this.$toast("已入库")										  
								    }).catch(res =>{
								 	   _this.$toast(res.response.data)	
								    })		
							   }
						 }
					});

				});
			},
			//选择订单号
		order () {
			this.isShow = true;
		},
		//获取参数
		chooseOrder (item) {
			this.purchaseOrderSerial = item;
			this.placehold = "";
		},
		//关闭模态框
		close (parame) {
			this.isShow = parame;
		},
		//关闭扫描结果框
		closeModal (parame) {
			this.isModalShow = parame;
		},
		//查看扫描结果
		scanResult () {
			this.isModalShow = true;
		},
		//获取扫描结果页面传过来的新数据
		newPorductList (data) {
			this.stockInProductInfos = data;
		},
		//根据订单号获取入库产品列表
		getProductList () {
			this.$http.get(this.$store.state.reqUrl + '/stock/getShopNotStockIn/'+this.purchaseOrderSerial , {
				/*params:{
					shopId:this.$store.state.shop_id
				}*/
			}).then(res => {
			   	  this.productList = res.data;          
		    })		
		},
		scansend(resultStr){
			if(!!resultStr) {    
				this.$http.post(this.$store.state.reqUrl + this.$route.query.shop_url, {
				purchaseOrderSerial: this.purchaseOrderSerial,
				productSerial:resultStr
			   }).then(res => {
			   	  this.$toast("入库成功!")
				  this.getProductList()			
			    }).catch(res =>{
			 	   this.$toast(res.response.data)	
			    })				
		    }
			result = ""
		  }
		},
	watch:{
		//监听订单号
		purchaseOrderSerial () {
			this.getProductList()
		}
	}
}
</script>

<style lang="less" scoped>
    .equipmentwarehousing {
    	margin-top: 200px;
    	margin-bottom: 100px;
    	.header {
    		width:100%;
    		position: fixed;
    		top: 100px;
    		left: 0;
    		.chooseOrder {
    			width: 100%;
    			height: 80px;
    			text-align: center;
    			line-height: 80px;
    			font-size: 30px;
    			background: #FFFFFF;
    			margin-bottom: 10px;
    		}
    		.result p {
    			font-size: 28px;
    		}
    		.scancode {
    			margin-top: 30px;
    			width: 100%;
    			height: 80px;
    			line-height: 80px;
    			text-align: center;
    			background: darkgoldenrod;
    			color: #FFFFFF;
    			font-size: 30px;
    		}
    		.lookInformation{
    			font-size: 30px;
    			text-align: center;
    			height: 80px;
    			line-height: 80px;
    			background: #FFFFFF;
    			margin-bottom: 30px;
    		}
    	}
    	/*.submit{
    		margin-top: 30px;
    		width:100%;
    		height: 80px;
    		line-height: 80px;
    		text-align: center;
    		background: brown;
    		color: #FFFFFF;
    		font-size: 30px;
    	}*/
    	.body{
    		background: none;
    		.productlist {
    		background: #FFFFFF;
    		margin: 20px 0;  
    		.box{
    			p{
    				text-align: center;
    				border-bottom: 1px solid gainsboro;
    				height: 60px;
    				line-height: 60px;
    				font-size: 30px;
    				&.active{
    				border-top: 1px solid gainsboro;
    			 }
    			}
    		}
    		  .scan {
    				width: 30%;
    				background: #00A1E9;
    				height: 60px;
    				line-height: 60px;
    				text-align: center;
    				font-size: 28px;
    				color: #FFFFFF;
    				margin: 0 auto;
    			}		
    		.shopName{
    			text-align: center;
                font-size: 36px;
                height: 100px;
                line-height: 100px;
    		}
    		.product {
    			padding: 10px 20px 20px 20px;
    			border-bottom:1px solid gainsboro;
    			.productName {
    				font-size: 30px;
    				text-align: center;
    				margin-bottom: 10px;
    			}
    			.scan {
    				width: 30%;
    				background: #00A1E9;
    				height: 60px;
    				line-height: 60px;
    				text-align: center;
    				font-size: 28px;
    				color: #FFFFFF;
    				margin: 0 auto;
    			}
    		}
    	}
    	}
    	.footer {
    		position: fixed;
    		bottom: 0;
    		left: 0;
    		height: 100px;
    		width: 100%;
    		background: #FFFFFF;
    		.submit {
    			width: 180px;
    			height: 60px;
    			line-height: 60px;
    			background: #F47920;
    			color: #FFFFFF;
    			font-size: 28px;
    			text-align: center;
    			float: right;
    			margin-right: 30px;
    			margin-top: 20px;
    			border-radius: 30px;
    		}
    	}
    }
</style>